<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <style>
        * {
            font-weight: 600;
            text-align: center;
        }
        body {
            background-color: violet;
        }
        div {
            padding: 10px;
        }
        input {
            border-radius: 50px;
        }
    </style>
</head>
<body>
<h1>用户登录</h1>
<!--<form action="/user/getUsername">-->
    <div>用户名:<input type="text" name="username" id="username"></div>
    <div>密码:<input type="password" name="password" id="password"></div>
    <div><input type="button" name="submit" value="登录" onclick="login()"></div>
<!--</form>-->
<script src = "https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js" ></script>
<script>
    function login() {
        $.ajax({
            type: "post",
            url: "/user/login",
            data: {
                username: $("#username").val(),
                password: $("#password").val()
            },
            success: function (result) {
                if(result) {
                    // 密码正确
                    location.href="calc.html";
                }
                else {
                    // 密码错误
                    alert("用户名或密码错误，滚");
                }
            }
        });
    }
</script>
</body>
</html>